@import (reference) '../style/variables.less';

.@{prefix}-locale-select {
	position: relative;
	display: inline-block;
	border: 1px solid #dadadf;
	border-radius: 14px;
	transition: background 0.2s;

	&:hover {
		background-color: #fafafa;
	}

	&:not([data-locale-count='1']):not([data-locale-count='2'])::after {
		content: '';
		position: absolute;
		top: 50%;
		right: 10px;
		margin-top: -3px;
		width: 0;
		height: 0;
		border: 4px solid transparent;
		border-top: 6px solid #7b7f8d;
		pointer-events: none;
	}

	a,
	span,
	select {
		padding: 0 24px 0 16px;
		height: 28px;
		text-align: center;
		text-decoration: none;
		line-height: 28px;
		appearance: none;
		border: 0;
		font-size: 16px;
		color: #7b7f8d;
		background: transparent;
		outline: none;
		cursor: pointer;
	}

	a,
	span {
		padding-right: 16px;
	}
}
